var positionObj = {
  init() {
    this.addPositionData();
    this.search();
    this.getData();
    this.opsitionsList = [];
  },
  addPositionData() {
    var url = "http://localhost:3000/positionDataList";
    axios.get(url).then(function (res) {
      positionObj.positionList(res.data);
      positionObj.opsitionsList = res.data;
      positionObj.addBrowsing(res.data);
    });
  },
  positionList(list) {
    var str = "";
    list.forEach(function (item) {
      str += `
          <a href="../job-details/job-details.html?id=${item.id}" class="work-list flex bg-fff w100p mt-10">
              <ul class="list w100p">
                <li data-id="${item.id}" class="item w100p">
                  <p class="flex jc-sb">
                    <span style="width: 260px;
                    white-space: nowrap; 
                    overflow: hidden; 
                    text-overflow: ellipsis; ">${item.workTitle}</span>
                    <span class="sc f12">推广</span>
                  </p>
                  <p class="flex jc-sb">
                    <span class="sc">${item.price}元/月</span>
                    <span class="f12 c888">${item.time}</span>
                  </p>
                  <p class="flex jc-sb aic bb2 pb-20">
                    <span class="condition fcc f12 ">${item.conditionAddress}</span>
                    <span class="condition fcc f12 ">${item.conditionExperience}</span>
                    <span class="condition fcc f12 ">${item.conditionEdu}</span> 
                    <button class="btn fff">申请</button>
                  </p>
                  <p class="company flex aic"><img src="${item.imgUrl}" alt="">
                <span class="f14 ml-10"style="width: 240px;
                    white-space: nowrap; 
                    overflow: hidden; 
                    text-overflow: ellipsis; ">${item.companyName}</span>
                <span class="f12 sc ml-10">认证</span>
                </p>
                </li>
              </ul>
            </a>
          `;
      $(".work").html(str);
    });
  },
  // 搜索
  search() {
    $("#submit").click(function () {
      var searchText = $("#searchText").val();
      if (searchText == "") {
        alert("请输入搜索内容");
      } else {
        var url = `http://localhost:3000/positionDataList?q=${searchText}`;
        axios
          .get(url)
          .then(function (res) {
            positionObj.render(res.data);
          })
          .catch(function (err) {
            console.log("查询失败", err);
          });
      }
    });
  },
  render(list) {
    var htmlStr = "";
    list.forEach(function (item) {
      htmlStr += `
               <a href="../job-details/job-details.html?id=${item.id}" class="work-list flex bg-fff w100p mt-10">
              <ul class="list w100p">
                <li class="item w100p">
                  <p class="flex jc-sb">
                    <span style="width: 260px;
                    white-space: nowrap; 
                    overflow: hidden; 
                    text-overflow: ellipsis; ">${item.workTitle}</span>
                    <span class="sc f12">推广</span>
                  </p>
                  <p class="flex jc-sb">
                    <span class="sc">${item.price}元/月</span>
                    <span class="f12 c888">${item.time}</span>
                  </p>
                  <p class="flex jc-sb aic bb2 pb-20">
                    <span class="condition fcc f12 ">${item.conditionAddress}</span>
                    <span class="condition fcc f12 ">${item.conditionExperience}</span>
                    <span class="condition fcc f12 ">${item.conditionEdu}</span> 
                    <button class="btn fff">申请</button>
                  </p>
                  <p class="company flex aic"><img src="${item.imgUrl}" alt="">
                <span class="f14 ml-10"style="width: 240px;
                    white-space: nowrap; 
                    overflow: hidden; 
                    text-overflow: ellipsis; ">${item.companyName}</span>
                <span class="f12 sc ml-10">认证</span>
                </p>
                </li>
              </ul>
            </a>
              `;
    });
    $(".work").html(htmlStr);
  },
  // 添加浏览记录
  addBrowsing(browsingList) {
    var userId = localStorage.userId;
    if (!userId) {
      return false;
    }

    var itemList = [];
    browsingList.forEach(function (item) {
      itemList.push(item);
    });
    // 使用事件委托，将点击事件绑定到父元素上
    $(".work").on("click", ".list", function (event) {
      // 获取点击的元素的父元素 <li>
      var li = $(event.target).closest("li");
      // 从 data-id 属性中获取 item 的 id
      var id = li.data("id");
      // 查找对应的 item
      var item = browsingList.find(function (item) {
        return item.id === id;
      });
      if (item) {
        var data = {
          imgUrl: item.imgUrl,
          workTitle: item.workTitle,
          price: item.price,
          time: item.time,
          positionId: item.id,
          userId: localStorage.userId,
          companyName: item.companyName,
          jobDetails: item.jobDetails,
          conditionAddress: item.conditionAddress,
          conditionExperience: item.conditionExperience,
          conditionEdu: item.conditionEdu,
        };
        var url = "http://localhost:3000/browsing";
        axios.post(url, data).then(function (res) {
          console.log(res.data);
        });
      }
    });
  },
  getData() {
    $("select").change(() => {
      // 获取选中的option的下标
      var selectedIndex1 = $(".address").find("option:selected").index();
      var selectedIndex2 = $(".welfare").find("option:selected").index();
      var selectedIndex3 = $(".worktype").find("option:selected").index();
      var address = $(".address").find("option").eq(selectedIndex1).text();
      var welfare = $(".welfare").find("option").eq(selectedIndex2).text();
      var worktype = $(".worktype").find("option").eq(selectedIndex3).text();
      // 构建查询参数
      var list = [];
      if (address !== "工作区域" && address !== "其他") {
        list = this.opsitionsList.filter((item) => {
          return item.conditionAddress.includes(address);
        });
      } else {
        list = this.opsitionsList;
      }

      if (address == "其他") {
        list = list.filter((item) => {
          return (
            !item.conditionAddress.includes("西乡塘") &&
            !item.conditionAddress.includes("青秀区") &&
            !item.conditionAddress.includes("江南区") &&
            !item.conditionAddress.includes("良庆区") &&
            !item.conditionAddress.includes("邕宁区") &&
            !item.conditionAddress.includes("高新区")
          );
        });
      }

      if (worktype !== "职业类别" && worktype !== "其他") {
        list = list.filter((item) => {
          return item.workType.includes(worktype);
        });
      }
      if (worktype == "其他") {
        list = list.filter((item) => {
          return (
            !item.workType.includes("建筑") &&
            !item.workType.includes("制造业") &&
            !item.workType.includes("汽车") &&
            !item.workType.includes("计算机") &&
            !item.workType.includes("餐饮") &&
            !item.workType.includes("日用品") &&
            !item.workType.includes("新闻") &&
            !item.workType.includes("广告") &&
            !item.workType.includes("日常服务") &&
            !item.workType.includes("财险") &&
            !item.workType.includes("保健品")
          );
        });
      }
      if (welfare !== "企业福利" && welfare !== "其他") {
        list = list.filter((item) => {
          return (
            item.welfare.includes(welfare) ||
            item.welfare2.includes(welfare) ||
            item.welfare3.includes(welfare)
          );
        });
      }

      if (welfare == "其他") {
        list = list.filter((item) => {
          return (
            !item.welfare.includes("住房公积金") &&
            !item.welfare.includes("五险") &&
            !item.welfare.includes("五险一金") &&
            !item.welfare.includes("包吃住") &&
            !item.welfare.includes("包吃") &&
            !item.welfare.includes("包住") &&
            !item.welfare.includes("双休") &&
            !item.welfare.includes("月休6天") &&
            !item.welfare.includes("工作餐") &&
            !item.welfare.includes("房补") &&
            !item.welfare.includes("餐补") &&
            !item.welfare.includes("油补") &&
            !item.welfare.includes("交通补") &&
            !item.welfare.includes("多劳多得") &&
            !item.welfare.includes("高薪资") &&
            !item.welfare.includes("压力小") &&
            !item.welfare.includes("免费培训")
          );
        });
      }
      positionObj.renderopsitionsList(list);
    });
  },

  // 合并处理函数
  renderopsitionsList(list) {
    var htmlStr = "";
    list.forEach((item) => {
      htmlStr += `
        <a href="../job-details/job-details.html?id=${item.id}" class="work-list flex bg-fff w100p mt-10">
              <ul class="list w100p">
                <li data-id="${item.id}" class="item w100p">
                  <p class="flex jc-sb">
                    <span style="width: 260px;
                    white-space: nowrap; 
                    overflow: hidden; 
                    text-overflow: ellipsis; ">${item.workTitle}</span>
                    <span class="sc f12">推广</span>
                  </p>
                  <p class="flex jc-sb">
                    <span class="sc">${item.price}元/月</span>
                    <span class="f12 c888">${item.time}</span>
                  </p>
                  <p class="flex jc-sb aic bb2 pb-20">
                    <span class="condition fcc f12 ">${item.conditionAddress}</span>
                    <span class="condition fcc f12 ">${item.conditionExperience}</span>
                    <span class="condition fcc f12 ">${item.conditionEdu}</span> 
                    <button class="btn fff">申请</button>
                  </p>
                  <p class="company flex aic"><img src="${item.imgUrl}" alt="">
                <span class="f14 ml-10"style="width: 240px;
                    white-space: nowrap; 
                    overflow: hidden; 
                    text-overflow: ellipsis; ">${item.companyName}</span>
                <span class="f12 sc ml-10">认证</span>
                </p>
                </li>
              </ul>
            </a>
      `;
    });
    $(".work").html(htmlStr);
  },
};
positionObj.init();
